<!DOCTYPE html>
<html lang="en">
<head>
    <title>学生信息管理系统</title>
    <link rel="stylesheet" type="text/css" href="/CSS/bootstrap.min.css">
    <link rel="stylesheet" type="text/css" href="/CSS/my-login.css">
</head>
<body class="my-login-page">
<section class="h-100">
    #if(codeError != null)
    <script>
        var codeError = "#(codeError)";
        alert(codeError);
    </script>
    #end
    #if(loginError !=null)
    <script>
        var loginError = "#(loginError)";
        alert(loginError);
    </script>
    #end
    <div class="container h-100">
        <div class="row justify-content-md-center h-100">
            <div class="card-wrapper">
                <div class="brand">
                    <img src="/img/logo.jpg">
                </div>
                <div class="card fat">
                    <div class="card-body">
                        <h4 class="card-title">登陆</h4>
                        <form method="post" action="/login">

                            <div class="form-group">
                                <label for="loginName">用户名：</label>

                                <input id="loginName" class="form-control" name="loginName" value="" required
                                       autofocus>
                            </div>

                            <div class="form-group">
                                <label for="password">密码：
                                </label>
                                <input id="password" type="password" class="form-control" name="password" required
                                       data-eye>
                            </div>
                            <div class="form-group">
                                <label for="password">验证码：
                                </label>
                                <input type="text" name="code" required class="form-control"/>
                            </div>
                            <div class="form-group">
                                <!-- 获取验证码并设置点击事件，点击之后获取新的验证码 -->
                                <img src="/code" onclick="this.src= '/code?x='+Math.random()"id="image">
                            </div>
                            <div class="form-group">
                                <label>
                                    <input type="checkbox" name="remember"> 记住我
                                </label>
                            </div>

                            <div class="form-group no-margin">
                                <button type="submit" class="btn btn-primary btn-block">
                                    登陆
                                </button>
                            </div>
                        </form>
                    </div>
                </div>
                <div class="footer">
                    Copyright &copy; Your Company 2017
                </div>
            </div>
        </div>
    </div>
</section>
</body>
</html>